<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户列表</title>

</head>
<body>
<div id="app">

    <table>

        <thead>
        <tr>
            <th>序号</th>
            <th>用户名</th>
            <th>密码</th>
        </tr>
        </thead>


        <tbody>

        <tr v-for="(user,index) in users">
            <td>{{index}}</td>
            <td>{{user.usernname}}</td>
            <td>{{user.password}}</td>
        </tr>
        </tbody>
    </table>

</div>
</body>
<script src="../lib/vue.global.js"></script>
<script src="../lib/axios.js"></script>
<script>

    const app = {
        data() {
            return {
                users: []
            }
        },mounted(){
             axios({
                  url:'http://localhost:8080/list.do',
                  method:'get',
                  dataType:'json'
             }).then((res)=>{
                   this.users= res.data;
             })
        }
    }


    Vue.createApp(app).mount('#app');
</script>

</html>